{% extends 'base.html' %}

{% block content %}
<div class="row">
  <div class="col-xs-12">
    <div class="col-xs-1"><h2><i class="glyphicon glyphicon-time"></i></h2></div>
    <div class="col-xs-11"><h2><span class="break"></span>Duty rota</h2></div>
  </div>
  <div class="col-xs-12">
    {% if not shifts %}
      <div class="col-xs-11 col-xs-offset-1">No shifts downloaded</div>
    {% else %}
    <table class="table table-striped bootstrap-datatable datatable">
      <thead>
        <tr>
          <th>User</th>
          <th>Shift time</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
      {% for shift in shifts %}
        <tr>
          <td>
            <a href="{% url user-profile pk=shift.user.id %}">{{ shift.user.username }}</a>
          </td>
          <td>
            {{ shift.start }} - {{ shift.end }}
          </td>
          <td>
            <a class="btn btn-xs" href="">
              <i class="glyphicon glyphicon-share"></i><span class="break"></span>
            </a>
          </td>
        </tr>
      {% endfor %}
      </tbody>
    </table>
    {% endif %}
  </div>
</div>
{% endblock content %}

{% block js %}
{% load compress %}
{{ block.super }}
{% compress js %}
<script type="text/coffeescript">

</script>
{% endcompress %}
{% endblock js %}